<template>
  <view class="">
    <view class="indexeditlist">
      <!-- 选择父级 -->

      <view class="indexedititem">
        <text>父级</text>
        <u-select
          @confirm="confirm"
          mode="single-column"
          v-model="show"
          :list="categoryList"
        ></u-select>
        <!-- 选中的name值 -->
        <!-- <text>{{ id }}</text> -->
        <text>{{ name }}</text>
        <u-button v-model="show" @click="selectParent">请选择</u-button>
      </view>
      <view class="indexedititem">
        <text>分类名称</text>
        <input type="text" v-model="addname" placeholder="请输入分类名称" />
      </view>

      <view class="indexedititem">
        <text>排序</text>
        <input type="number" v-model="weight" placeholder="请输入排序" />
      </view>
    </view>
    <view class="indexbtn" @click="handleAdd"> 确认提交 </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      // 父级列表
      // list: [],
      categoryList: [],
      // 默认的下拉菜单
      list: [
        // {
        //   value: "1",
        //   label: "江",
        // },
        // {
        //   value: "2",
        //   label: "湖",
        // },
      ],

      show: false,
      //   选中的name值
      name: "",
      //   选中的id
      id: "",
      //   父级id
      pid: "",
      //   权重
      weight: "",
      //   分类名称
      addname: "",
    };
  },
  methods: {
    //   打开选择父级
    selectParent() {
      this.show = true;
      //   查询父商品列表
      uni.request({
        url: "http://gxyckf.1qit.com/api/admin.category/addcategorylist", //仅为示例，并非真实接口地址。
        data: {},
        method: "GET",

        header: {
          token: uni.getStorageSync("token"),
        },
        success: (res) => {
          if (res.data.code == 1) {
            // var shen = JSON.parse(JSON.stringify(res.data.data));
            // console.log(res.data.data);
            // ???????
            // var list = [];
            // 遍历数组的每一个对象 拿到name和id
            // var a = res.data.data.map((item) => {
            //   let obj = {
            //     value: item.id,
            //     label: item.name,
            //   };
            //   return obj;
            // });
            // console.log(a);
            // this.categoryList = a;

            // var a = JSON.parse(
            //   JSON.stringify(shen)
            //     .replace(/id/g, "value")
            //     .replace(/name/g, "label")
            // );
            // // 已改完的数组
            // // console.log(a);
            // var newData = a.map((item) => {
            //   return { value: item.value, label: item.label };
            // });
            // // console.log(newData);
            // this.categoryList = newData;

            // res.data.data.map((item) => {
            //   var obj = {};
            //   obj.id = item.id;
            //   obj.name = item.name;
            //   // console.log(obj);
            //   this.categoryList.push(obj);
            //   // console.log(this.categoryList);

            //   // var newData = this.categoryList.map((item) => {
            //   //   return { value: item.id, label: item.name };
            //   // });
            //   // console.log(newData);
            // });

            var list = [];
            for (var i in res.data.data) {
              // console.log(res.data.data[i].name);
              var str = res.data.data[i].name;
              str = str.replace(/&nbsp;/gi, "");
              var obj = {};
              obj.value = res.data.data[i].id;
              obj.label = str;
              obj.pid = res.data.data[i].pid;
              list.push(obj);
            }
            this.categoryList = list;
          }
        },
      });
    },
    //   选择商品父级
    confirm(e) {
      console.log(e);
      e.map((item) => {
        // console.log(item);
        this.name = item.label;
        this.pid = item.value;
      });
    },
    // 新增的提交
    handleAdd() {
      uni.request({
        url: "http://gxyckf.1qit.com/api/admin.category/add", //仅为示例，并非真实接口地址。
        method: "post",
        data: {
          pid: this.pid,
          name: this.addname,
          weigh: this.weight,
        },
        method: "POST",

        header: {
          token: uni.getStorageSync("token"),
        },
        success: (res) => {
          console.log(res.data);
          if (res.data.code == 1) {
            // this.data = {};

            uni.navigateTo({
              url: "/pages/classification/classification",
            });
          }
        },
      });
    },
  },
  mounted() {
    //   查询父商品列表
    uni.request({
      url: "http://gxyckf.1qit.com/api/admin.category/addcategorylist", //仅为示例，并非真实接口地址。
      data: {},
      method: "GET",

      header: {
        token: uni.getStorageSync("token"),
      },
      success: (res) => {
        if (res.data.code == 1) {
          // var shen = JSON.parse(JSON.stringify(res.data.data));
          // // console.log(res.data.data);
          // // ???????
          // // var list = [];
          // // 遍历数组的每一个对象 拿到name和id
          // // var a = res.data.data.map((item) => {
          // //   let obj = {
          // //     value: item.id,
          // //     label: item.name,
          // //   };
          // //   return obj;
          // // });
          // // console.log(a);
          // // this.categoryList = a;

          // var a = JSON.parse(
          //   JSON.stringify(shen)
          //     .replace(/id/g, "value")
          //     .replace(/name/g, "label")
          // );
          // // 已改完的数组
          // // console.log(a);
          // var newData = a.map((item) => {
          //   return { value: item.value, label: item.label };
          // });
          // // console.log(newData);
          // this.categoryList = newData;

          // res.data.data.map((item) => {
          //   var obj = {};
          //   obj.id = item.id;
          //   obj.name = item.name;
          //   // console.log(obj);
          //   this.categoryList.push(obj);
          //   // console.log(this.categoryList);

          //   // var newData = this.categoryList.map((item) => {
          //   //   return { value: item.id, label: item.name };
          //   // });
          //   // console.log(newData);
          // });

          var list = [];
          for (var i in res.data.data) {
            // console.log(res.data.data[i].name);
            var str = res.data.data[i].name;
            str = str.replace(/&nbsp;/gi, "");
            var obj = {};
            obj.value = res.data.data[i].id;
            obj.label = str;
            obj.pid = res.data.data[i].pid;
            list.push(obj);
          }
          this.categoryList = list;
        }
      },
    });
  },

  onLoad() {},
};
</script>

<style>
.u-hairline-border:after {
  border: 0 !important;
}
.indexeditlist {
  width: 90%;
  margin: 4% 5%;
}
.indexedititem {
  border-bottom: 1px solid #e6e6e6;
  padding: 5% 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.indexedititem text {
  width: 160rpx;
  color: #313131;
}
.indexedititem input {
  font-size: 28rpx;
  width: 500rpx;
  color: #828282;
  text-align: right;
}
.indexbtn {
  width: 80%;
  margin: 2% 10%;
  text-align: center;
  background: red;
  font-size: 32rpx;
  line-height: 3;
  color: #fff;
  border-radius: 60rpx;
  margin-top: 100rpx;
}
</style>
